<template>
  <div class="dashboard-quick-row">
    <button v-for="action in quickActions" :key="action.label" class="quick-action-btn" @click="action.action">
      <i :class="action.icon"></i>
      <span>{{ action.label }}</span>
    </button>
  </div>
</template>
<script setup lang="ts">
const props = defineProps<{ quickActions: any[] }>()
</script>
<script lang="ts">
export default {}
</script>
<style scoped>
.dashboard-quick-row {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.quick-action-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(90deg, #42a5f5 0%, #1976d2 100%);
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 14px 28px;
  font-size: 1.08rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(25, 118, 210, 0.07);
  transition: all 0.2s;
}
.quick-action-btn:hover {
  background: linear-gradient(90deg, #1976d2 0%, #42a5f5 100%);
  color: #fff;
  transform: translateY(-2px) scale(1.03);
}
</style> 